<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>图书信息添加</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="js/jquery-3.2.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <style>
        .form-group {
            margin-bottom: 0;
        }

        body {
            font-family: 'Roboto', sans-serif;
            font-size: 16px;
            font-weight: 300;
            color: #888;
            line-height: 30px;
            text-align: center;
        }

        strong { font-weight: 500; }

        a, a:hover, a:focus {
            color: #4aaf51;
            text-decoration: none;
            -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
        }

        h1, h2 {
            margin-top: 10px;
            font-size: 38px;
            font-weight: 100;
            color: #555;
            line-height: 50px;
        }

        h3 {
            font-size: 22px;
            font-weight: 300;
            color: #555;
            line-height: 30px;
        }

        img { max-width: 100%; }

        ::-moz-selection { background: #4aaf51; color: #fff; text-shadow: none; }
        ::selection { background: #4aaf51; color: #fff; text-shadow: none; }


        .btn-link-1 {
            display: inline-block;
            height: 50px;
            margin: 5px;
            padding: 16px 20px 0 20px;
            background: #4aaf51;
            font-size: 16px;
            font-weight: 300;
            line-height: 16px;
            color: #fff;
            -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
        }
        .btn-link-1:hover, .btn-link-1:focus, .btn-link-1:active { outline: 0; opacity: 0.6; color: #fff; }

        .btn-link-1.btn-link-1-facebook { background: #4862a3; }
        .btn-link-1.btn-link-1-twitter { background: #55acee; }
        .btn-link-1.btn-link-1-google-plus { background: #dd4b39; }

        .btn-link-1 i {
            padding-right: 5px;
            vertical-align: middle;
            font-size: 20px;
            line-height: 20px;
        }

        .btn-link-2 {
            display: inline-block;
            height: 50px;
            margin: 5px;
            padding: 15px 20px 0 20px;
            background: rgba(0, 0, 0, 0.3);
            border: 1px solid #fff;
            font-size: 16px;
            font-weight: 300;
            line-height: 16px;
            color: #fff;
            -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
        }
        .btn-link-2:hover, .btn-link-2:focus,
        .btn-link-2:active, .btn-link-2:active:focus { outline: 0; opacity: 0.6; background: rgba(0, 0, 0, 0.3); color: #fff; }

        .inner-bg {
            padding: 100px 0 170px 0;
        }

        .top-content .text {
            color: #fff;
        }

        .top-content .text h1 { color: #fff; }

        .top-content .description {
            margin: 20px 0 10px 0;
        }

        .top-content .description p { opacity: 0.8; }

        .top-content .description a {
            color: #fff;
        }
        .top-content .description a:hover,
        .top-content .description a:focus { border-bottom: 1px dotted #fff; }

        .form-box {
            margin-top: 35px;
        }

        .form-top {
            overflow: hidden;
            padding: 0 25px 15px 25px;
            background: #fff;
            -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
            text-align: left;
        }

        .form-top-left {
            float: left;
            width: 75%;
            padding-top: 25px;
        }

        .form-top-left h3 { margin-top: 0; }

        .form-top-right {
            float: left;
            width: 25%;
            padding-top: 5px;
            font-size: 66px;
            color: #ddd;
            line-height: 100px;
            text-align: right;
        }

        .form-bottom {
            padding: 25px 25px 30px 25px;
            background: #eee;
            -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
            text-align: left;
        }

        .form-bottom form textarea {
            height: 100px;
        }

        .form-bottom form button.btn {
            width: 100%;
        }

        .form-bottom form .input-error {
            border-color: #4aaf51;
        }

        .social-login {
            margin-top: 35px;
        }
        .social-login h3 {
            color: #fff;
        }
        .social-login-buttons {
            margin-top: 25px;
        }
        .copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
        /***** Media queries *****/
        @media (min-width: 992px) and (max-width: 1199px) {}
        @media (min-width: 768px) and (max-width: 991px) {}
        @media (max-width: 767px) {
            .inner-bg { padding: 60px 0 110px 0; }
        }
        @media (max-width: 415px) {
            h1, h2 { font-size: 32px; }
        }
    </style>
    <script>
        $(function () {
            $('#header').load('admin_header.html');
        })
    </script>
</head>
<body background="img/sky.jpg" style=" background-repeat:no-repeat ;
background-size:100% 100%;
background-attachment: fixed;">

<div id="header"></div>
<div style="position: relative;padding-top: 60px; width: 80%;margin-left: 10%">
    <form action="book_add_do.html" method="post" id="addbook" class="form-inline">
        <div class="form-group">
            <label for="name">图书名</label>
            <input type="text" class="form-control" name="name" id="name" placeholder="请输入书名">
        </div>
        <div class="form-group">
            <label for="author">作者</label>
            <input type="text" class="form-control" name="author" id="author" placeholder="请输入作者名">
        </div>
        <div class="form-group">
            <label for="publish">出版社</label>
            <input type="text" class="form-control" name="publish" id="publish" placeholder="请输入出版社">
        </div>
        <div class="form-group">
            <label for="isbn">ISBN</label>
            <input type="text" class="form-control" name="isbn" id="isbn" placeholder="请输入ISBN">
        </div>
        <div class="form-group">
            <label for="introduction">简介</label>
            <textarea class="form-control" rows="3" name="introduction" id="introduction"
                      placeholder="请输入简介"></textarea>
        </div>
        <div class="form-group">
            <label for="language">语言</label>
            <select id="language" class="form-control">
                <option value="Chinese">中文</option>
                <option value="English">英文</option>
                <option value="Korea">韩文</option>
                <option value="Janpanese">日文</option>
                <option value="Other">其他语言</option>
            </select>
        </div>
        <div class="form-group">
            <label for="price">价格</label>
            <input type="text" class="form-control" name="price" id="price" placeholder="请输入价格">
        </div>
        <div class="form-group">
            <label for="pubstr">出版日期</label>
            <input type="date" class="form-control" name="pubstr" id="pubstr" placeholder="请输入出版日期">
        </div>
        <div class="form-group">
            <label for="classId">分类号</label>
            <input type="text" class="form-control" name="classId" id="classId" placeholder="请输入分类号">
        </div>
        <div class="form-group">
            <label for="number">数量</label>
            <input type="text" class="form-control" name="number" id="number" placeholder="请输入图书数量">
        </div>

        <div class="row">
            <div class="col-sm-6 col-sm-offset-3 social-login">
                <div class="social-login-buttons">
                    <input type="submit" value="添加" class="btn btn-success btn-sm" class="text-left">
                    <input type="button" value="取消" class="btn btn-danger btn-sm text-right" onclick="window.history.back(-1)">
                </div>
            </div>
        </div>

        <script>
            $("#addbook").submit(function () {
                if ($("#name").val() == '' || $("#author").val() == '' || $("#publish").val() == '' || $("#isbn").val() == '' || $("#language").val() == '' || $("#price").val() == '' || $("#pubstr").val() == '' || $("#classId").val() == '' || $("#pressmark").val() == '' || $("#number").val() == '') {
                    alert("请填入完整图书信息！");
                    return false;
                }
            })
        </script>
    </form>
</div>
</body>
</html>
